var uploadImg = Vue.component('upload-img', {
    template: `
        <div class="item-content">
            <ul  class="evaluate-ul">
                <li v-for="(image,key) in images">
                    <img :src="src+image" @click='delImage(image)' class="evaluate-img"/>
                    <span @click='delImage(key)' class="evaluate-remove"><i class="fa fa-minus-circle fa-lg"></i></span>
                </li>
                <li>
                <form :id="id" enctype="multipart/form-data">
                    <i class="fa fa-camera fa-3x evaluate-camera" v-on:click='addPic'></i><input :id='fid' type="file" name="fileArray" @change="onFileChange" multiple style="display: none;" accept="image/jpg,image/jpeg,image/png,image/bmp,image/ico,image/gif">
                </form>
                </li>
            </ul>
        </div>
    `,
    props:{
        'fid':{
            type:String,
            default:''
        }
    },
    data(){
        return {
            images:[],
            id:'imgfd'+Math.random().toString().split('.')[1],
            src:cfg.baseUrl,
        }
    },
    methods:{
         //添加图片
        addPic(e){
            e.preventDefault();
            $('#'+this.fid).trigger('click');
            return false;
        },
        onFileChange(e) {
            // var files = e.target.files;
            // if (!files.length)return; 
            // this.createImage(files);
            var self = this;
            if(event.target.value.length>0){
                console.log(document.getElementById(self.id))
                var fd = new FormData(document.getElementById(self.id));
                console.log(fd)
                ajax.uploadImg({
                    type:'post',
                    param:fd,
                    cb(data){
                        data.data.relaPathList.map((v,i)=>{
                            self.images.push(v)
                        });
                        self.$emit('input',self.images);   
                    },
                    failCb(){
                        document.getElementById(self.id).reset();
                    }
                });
            }
        },
        createImage(file) {
            var image = new Image();         
            var self = this;
            var leng=file.length;
            for(var i=0;i<leng;i++){
                var reader = new FileReader();
                reader.readAsDataURL(file[i]); 
                reader.onload =function(e){
                   self.images.push(e.target.result);                                    
                };    
                self.$emit('input',self.images);             
            }                        
        },
        delImage(index){
            this.images.splice(index,1);
        },
    },
    watch:{
       
    },
    mounted(){
        
    }
});